<template>
  <div>
    <div class="app-container">
      <div class="search-container">
        <el-form :inline="true" class="demo-form-inline">
          <el-form-item>
            <el-button :disabled="false" type="primary" @click="AddHitory()">新增</el-button>
          </el-form-item>
        </el-form>
        <el-table :data="datatable" border height="540px" style="width: 100%">
          <el-table-column prop="id" label="序号" align="center" width="50px">
            <template #default="scope">
              <span>{{ scope.$index + 1 }}</span>
            </template>
          </el-table-column>
          <el-table-column label="种母耳号" align="center" width="140px">
            <template #default="scope">
              <el-select v-model="scope.row.earTag" placeholder="请选择耳号" style="width:100px"
                @change="getByIdHistoryList(scope.row.earTag)">
                <el-option v-for="item in eweWeanings" :key="item.earTag" :label="item.earTag" :value="item.earTag" />
              </el-select>
            </template>
          </el-table-column>
          <el-table-column label="配种日期" align="center" width="140px">
            <template v-slot="scope">
              <el-date-picker v-model="scope.row.breedDate" type="date" placeholder="配种日期" style="width:115px"
                format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
            </template>
          </el-table-column>
          <el-table-column label="种公耳号" align="center" width="140px">
            <template v-slot="scope">
              <el-input v-model="scope.row.breedingRaw" placeholder="种公耳号" />
            </template>
          </el-table-column>
          <el-table-column label="妊检日期" align="center" width="140px">
            <template v-slot="scope">
              <el-date-picker v-model="scope.row.pregnancyDate" type="date" placeholder="妊检日期" style="width:115px"
                format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
            </template>
          </el-table-column>
          <el-table-column label="妊检结果" align="center" width="200px">
            <template v-slot="scope">
              <el-select v-model="scope.row.pregnancyResult" placeholder="请选择妊检结果">
                <el-option label="空胎" :value="1" />
                <el-option label="返情" :value="2" />
                <el-option label="流产" :value="3" />
                <el-option label="怀孕" :value="4" />
                <el-option label="未孕" :value="5" />
              </el-select>
            </template>
          </el-table-column>
          <el-table-column label="分娩日期" align="center" width="140px">
            <template v-slot="scope">
              <el-date-picker v-model="scope.row.deliveryDate" type="date" placeholder="分娩日期" style="width:115px"
                format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
            </template>
          </el-table-column>
          <el-table-column label="健羔数" align="center" width="105px">
            <template v-slot="scope">
              <el-input v-model="scope.row.healthyNumber" placeholder="健羔数" />
            </template>
          </el-table-column>
          <el-table-column label="健羔总重" align="center" width="105px">
            <template v-slot="scope">
              <el-input v-model="scope.row.healthyTotalWeight" placeholder="健羔总重" />
            </template>
          </el-table-column>
          <el-table-column label="弱羔数" align="center" width="105px">
            <template v-slot="scope">
              <el-input v-model="scope.row.lambNumber" placeholder="弱羔数" />
            </template>
          </el-table-column>
          <el-table-column label="畸形数" align="center" width="105px">
            <template v-slot="scope">
              <el-input v-model="scope.row.malformationNumber" placeholder="畸形数" />
            </template>
          </el-table-column>
          <el-table-column label="死胎数" align="center" width="105px">
            <template v-slot="scope">
              <el-input v-model.number="scope.row.stillbirthNumber" placeholder="死胎数" />
            </template>
          </el-table-column>
          <el-table-column label="木乃伊数" align="center" width="105px">
            <template v-slot="scope">
              <el-input v-model.number="scope.row.mummyNumber" placeholder="木乃伊数" />
            </template>
          </el-table-column>
          <el-table-column label="畸胎数" align="center" width="105px">
            <template v-slot="scope">
              <el-input v-model.number="scope.row.freaksNumber" placeholder="畸胎数" />
            </template>
          </el-table-column>
          <el-table-column label="当前胎次" align="center" width="105px">
            <template v-slot="scope">
              <el-input v-model.number="scope.row.currentPregnancy" placeholder="当前胎次" />
            </template>
          </el-table-column>
          <el-table-column label=" 断奶日期" align="center" width="140px">
            <template v-slot="scope">
              <el-date-picker v-model="scope.row.weaningDate" type="date" placeholder="断奶日期" style="width:115px"
                format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
            </template>
          </el-table-column>
          <el-table-column label="断奶只数" align="center" width="105px">
            <template v-slot="scope">
              <el-input v-model.number="scope.row.weaningCount" placeholder="断奶只数" />
            </template>
          </el-table-column>
          <el-table-column label="断奶窝重" align="center" width="105px">
            <template v-slot="scope">
              <el-input v-model="scope.row.weaningWeight" placeholder="断奶窝重" />
            </template>
          </el-table-column>
        </el-table>
        <div>
          <el-button link type="danger" @click="Addform()"> + 增行 </el-button>
          <el-button link type="danger" @click="Deleteform()"> - 删行 </el-button>
        </div>
      </div>
    </div>
  </div>
</template>
<script setup lang="ts">
import { reactive, ref, onMounted } from 'vue'
import { ElMessage } from 'element-plus'
//耳号
import sheepAblactation from '@/api/ProductionManagement/SheepAblactation/index'
//历史记录添加
import history from '@/api/HistoryRecord/index'

import { useRouter } from 'vue-router'
const router = useRouter();

onMounted(() => {
  getAblactationList()

})

//查询条件
const queryParams: any = reactive({
  ablactationAction: "",
  ablactationEnd: "",
  earTag: "",
  toBuildingManageId: "" || 0,
  userId: "" || 0,
  pageIndex: 1,
  pageSize: 15,
});
//分页
const page = reactive({
  totalCount: 0,
  pageCount: 0
})
//获取种母断奶列表
const eweWeanings = ref()
const getAblactationList = () => {
  sheepAblactation.getSheepAblactationList(queryParams).then(res => {
    eweWeanings.value = res.data.data
    page.totalCount = res.data.totalCount
    page.pageCount = res.data.pageCount
  })
}


//添加字段

const datatable = reactive([
  {
    earTag: "",
    "breedDate": "",
    "breedingRaw": "",
    "pregnancyDate": "",
    "pregnancyResult": null,
    "deliveryDate": "",
    "healthyNumber": null,
    "healthyTotalWeight": null,
    "lambNumber": null,
    "malformationNumber": null,
    "stillbirthNumber": null,
    "mummyNumber": null,
    "freaksNumber": null,
    "weaningDate": "",
    "weaningCount": null,
    "weaningWeight": null,
    "currentPregnancy": null,
  },
])
const c = ref(0);
//增行
const Addform = () => {
  c.value = 1;
  datatable.forEach((item) => {
    c.value++;
  });
  datatable.push({

    "earTag": "",
    "breedDate": "",
    "breedingRaw": "",
    "pregnancyDate": "",
    "pregnancyResult": null,
    "deliveryDate": "",
    "healthyNumber": null,
    "healthyTotalWeight": null,
    "lambNumber": null,
    "malformationNumber": null,
    "stillbirthNumber": null,
    "mummyNumber": null,
    "freaksNumber": null,
    "weaningDate": "",
    "weaningCount": null,
    "weaningWeight": null,
    "currentPregnancy": null,
  });
};
//删行
const Deleteform = () => {
  datatable.pop();
};


//反填
const getByIdHistoryList = (earTag: any) => {
  history.getByIdHistory(earTag).then(res => {
    datatable.forEach(datatable => {
      datatable.earTag = res.data.earTag;
      datatable.breedDate = res.data.breedDate;
      datatable.breedingRaw = res.data.breedingRaw;
      datatable.pregnancyDate = res.data.pregnancyDate;
      datatable.pregnancyResult = res.data.pregnancyResult;
      datatable.deliveryDate = res.data.deliveryDate;
      datatable.healthyNumber = res.data.healthyNumber;
      datatable.healthyTotalWeight = res.data.healthyTotalWeight;
      datatable.lambNumber = res.data.lambNumber;
      datatable.malformationNumber = res.data.malformationNumber;
      datatable.stillbirthNumber = res.data.stillbirthNumber;
      datatable.mummyNumber = res.data.mummyNumber;
      datatable.freaksNumber = res.data.freaksNumber;
      datatable.weaningDate = res.data.weaningDate;
      datatable.weaningCount = res.data.weaningCount;
      datatable.weaningWeight = res.data.weaningWeight;
    })
  })
  console.log(datatable)
}



onMounted(() => {
  getByIdHistoryList();
})

//添加
const AddHitory = () => {
  console.log(datatable)
  history.addHistory(datatable).then(res => {
    if (res.data > 0) {
      ElMessage({
        message: '添加成功',
        type: 'success',
      })
      router.push({
        name: "History",
      })
    }
  })
}

</script>
